<template>
  <div class="list-table">
    <div class="area-header" />
    <!-- <el-form ref="queryForm" :model="queryParams" :inline="true">
      <el-form-item :label="$t('申请标题')" prop="actTitle">
        <el-input v-model="queryParams.actTitle" :placeholder="$t('申请标题')" @keyup.enter.native="queryHandle" />
      </el-form-item>
      <el-form-item :label="$t('申请人')" prop="applyUserId">
        <UserSelect
          v-model="queryParams.applyUserId"
          :placeholder="$t('申请人')"
        />
      </el-form-item>
      <el-form-item :label="$t('合同名称')" prop="name">
        <el-input
          v-model="queryParams.name"
          :placeholder="$t('合同名称')"
          clearable
          @keyup.enter.native="queryHandle"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="queryHandle">{{ $t("搜索") }}</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">{{ $t("重置") }}</el-button>
      </el-form-item>
    </el-form> -->

    <el-table v-loading="loading" tooltip-effect="darkTable" :data="dealContractList" class="nowrapTable showOnlyLine" border>
      <el-table-column :label="$t('序号')" type="index" align="center" show-overflow-tooltip width="50">
        <template slot-scope="scope">
          {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
        </template>
      </el-table-column>
      <el-table-column :label="$t('申请标题')" align="center" prop="actTitle" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.actTitle }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('申请人')" align="center" prop="userName" show-overflow-tooltip width="100">
        <template slot-scope="scope">
          {{ scope.row.userName || scope.row.applyUserName }}
        </template>
      </el-table-column>
      <el-table-column v-if="isShowDeal === 'hidden'" :label="$t('项目名称')" show-overflow-tooltip align="center" prop="dealName" width="200px" />
      <el-table-column :label="$t('申请时间')" align="center" prop="applyTime" show-overflow-tooltip width="110px">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.applyTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('合同名称')" align="center" prop="name" show-overflow-tooltip width="200px" />
      <el-table-column :label="$t('合同金额') + $t('金额单位')" align="center" prop="money" show-overflow-tooltip width="100px">
        <template slot-scope="scope">
          <span>{{ moneyFormat(scope.row.money, 'w') }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('收付款类型')" align="center" prop="isPayment" show-overflow-tooltip width="110px">
        <template slot-scope="scope">
          <span>{{ $t(scope.row.isPayment) }}</span>
        </template>
      </el-table-column>
      <el-table-column :label="$t('是否用印')" align="center" prop="isSeal" width="100px">
        <template slot-scope="scope">
          <span>{{ $t(scope.row.isSeal) }}</span>
        </template>
      </el-table-column>
      <el-table-column fixed="right" :label="$t('审批状态')" align="center" width="120">
        <template slot-scope="scope">
          <ProcessStatus :status="scope.row.actStatus" :act-id="scope.row.actId" />
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 股权合同详情 -->
    <el-dialog :title="$t(title)" :visible.sync="formEquityOpen" :close-on-click-modal="false" :lock-scroll="false" append-to-body custom-class="dialogForm">
      <dealContractForm ref="dealContractForm" />
    </el-dialog>
  </div>
</template>

<script>
import { historicalContractList } from '@/api/sass/yueyin/deal/contract/yueYinDealContract.js'
import dealContractForm from '@/views/saas/yueyin/deal/contract/yueYinDealContractForm.vue'
import ProcessStatus from '@/components/Act/ProcessStatus'
export default {
  components: {
    ProcessStatus,
    dealContractForm
  },
  data() {
    return {
      loading: false,
      // 总条数
      total: 0,
      // 合同信息表格数据
      dealContractList: [],
      // 弹出层标题
      title: '历史合同',
      formOpen: false,
      // 股权弹出层
      formEquityOpen: false,
      // 查询参数
      queryParams: {
        applyUserId: '',
        dealId: this.$route.query.id,
        name: undefined,
        company: undefined,
        pageNum: 1,
        pageSize: 10
      },
      // 表单参数
      form: {},
      isShowDeal: undefined
    }
  },
  watch: {
    formOpen: {
      handler(val) {
        if (!val) {
          this.formEquityOpen = false
        }
      }
    }
  },
  created() {
  },
  methods: {
    getList(data) {
      console.log(data)
      this.loading = true
      if (this.$route.query.id === undefined || this.$route.query.id === null || this.$route.query.id === '') {
        this.isShowDeal = 'hidden'
      }
      if (data != null && data.id !== undefined && data.id !== '' && data.id !== null) {
        historicalContractList(data.id).then(response => {
          this.dealContractList = response.rows
          this.total = response.total

          // 字段校正字典label
          this.getDicts('sys_yes_no').then(dictYesNo => {
            dictYesNo.data.forEach((item) => {
              this.dealContractList.forEach(dict => {
                if (item.dictValue === dict.isSeal) {
                  dict.isSeal = item.dictLabel
                }
              })
            })
          })

          this.getDicts('collection_payment_no').then(dictCPN => {
            dictCPN.data.forEach((item) => {
              this.dealContractList.forEach(dict => {
                if (item.dictValue === dict.isPayment) {
                  dict.isPayment = item.dictLabel
                }
              })
            })
          })

          this.loading = false
        })
      } else {
        this.msgError(this.$t('获取异常!'))
        this.loading = false
      }
    },
    updateHandle(row) {
      this.formEquityOpen = true
      this.$nextTick(() => {
        // 股权
        this.$refs.dealContractForm.viewChangeContract(row)
      })
    },
    /** 搜索按钮操作 */
    queryHandle() {
      this.queryParams.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm('queryForm')
      this.queryHandle()
    }
  }
}
</script>

<style scoped>

</style>
